<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>小米商城客户端</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <link rel="stylesheet" href="shouye.css"/>
    <link rel="stylesheet" href="bootstrap-3.3.5-dist/css/bootstrap.css"/>
    <script src="bootstrap-3.3.5-dist/jquery-2.0.3.js"></script>
    <script src="bootstrap-3.3.5-dist/js/bootstrap.js"></script>
    <style>
        h2 {
            font-size: 0.3rem;
            font-weight: 400;
            line-height: 0.34rem;
            margin-bottom: 0.1rem;
            margin-top: 0;
            color: #333;
        }
       .chanpin a {
            text-decoration: none;
            color: #9c9c9c;
        }
    </style>
</head>
<body>
<section id="wrapper">
    <header>
        <a href="#"><img src="image/header.png"/></a>
        <section class="close">
            <a href="#"><img src="image/top-x.png"/></a>
        </section>
    </header>
    <section class="search">
        <div class="search-link">
            <a href="sousuo.html" style="text-decoration: none; color: #9c9c9c">
                <div class="icon"><img src="image/icon_03.jpg"/></div>
                <span class="wenzi">搜索商品名称</span>
            </a>
        </div>
        <div class="search-border"></div>
    </section>
    <section class="banner">
        <div class="container-fluid" style="padding: 0">
            <div class="row-fluid">
                <div class="span12">
                    <div class="carousel slide" id="carousel-443939">
                        <ol class="carousel-indicators">
                            <li data-slide-to="1" data-target="#carousel-443939" class="active">
                            </li>
                            <li data-slide-to="2" data-target="#carousel-443939">
                            </li>
                            <li data-slide-to="3" data-target="#carousel-443939">
                            </li>
                            <li data-slide-to="4" data-target="#carousel-443939">
                            </li>
                            <li data-slide-to="5" data-target="#carousel-443939">
                            </li>
                        </ol>
                        <div class="carousel-inner">
                            <div class="item active"></div>
                            <div class="item"></div>
                            <div class="item"></div>
                            <div class="item"></div>
                            <div class="item"></div>
                        </div> <a data-slide="prev" href="#carousel-443939" class="left carousel-control"></a> <a data-slide="next" href="#carousel-443939" class="right carousel-control"></a>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <section class="list">
        <section class="list-mobile">
            <section class="mobile">
                <a href="xiaominot.html"><div><img src="image/1.jpg"/></div></a>
                <a href="#"><div><img src="image/2.jpg"/></div></a>
                <ahref="#"><div><img src="image/3.jpg"/></div></a>
            </section>
        </section>
        <section class="chanpin">
            <a href="#">
                <div class="img"><img src="image/a.1.jpg"/></div>
                <div class="jieshao">
                    <h2>小米手机5</h2>
                    <p>骁龙820处理器/4GB内存/128GB闪存/4轴防抖相机/3D陶瓷机身</p>
                    <span>1999元 起</span>
                </div>
            </a>
        </section>
        <section class="chanpin">
            <a href="#">
                <div class="img"><img src="image/a.1.jpg"/><img class="xp" src="image/a.01.png"/></div>
                <div class="jieshao">
                    <h2>小米手机5尊享版（3D玻璃）</h2>
                    <p>骁龙820处理器/4GB内存/128GB闪存/4轴防抖相机/3D玻璃机身</p>
                    <span>2599元</span>
                </div>
            </a>
        </section>
        <section class="chanpin">
            <a href="#">
                <div class="img"><img src="image/a.2.jpg"/><img class="xp" src="image/a.01.png"/></div>
                <div class="jieshao">
                    <h2>小米手机4s</h2>
                    <p>骁龙808处理器/64GB内存/指纹识别/全网通双卡双待/5英寸非凡手感</p>
                    <span>1699元 </span>
                </div>
            </a>
        </section>
        <section class="chanpin">
            <a href="#">
                <div class="img"><img src="image/a.3.jpg"/><img class="xp" src="image/a.01.png"/></div>
                <div class="jieshao">
                    <h2>红米手机3高配版</h2>
                    <p>指纹识别/全网通双卡双待/金属机身/4100mAh大电池/3GB内存+32GB容量/最高支持128GB扩展</p>
                    <span>899元 </span>
                </div>
            </a>
        </section>
        <section class="chanpin">
            <a href="#">
                <div class="img"><img src="image/note.jpg"/></div>
                <div class="jieshao">
                    <h2>小米Note</h2>
                    <p>独立HiFi音乐系统/5.7英寸全高清屏幕/骁龙801四核处理器</p>
                    <span>1499元 起</span>
                </div>
            </a>
        </section>
        <section class="chanpin">
            <a href="#">
                <div class="img"><img src="image/a.4.jpg"/></div>
                <div class="jieshao">
                    <h2>小米平板2</h2>
                    <p>全金属机身/7.9英寸视网膜屏幕/800万像素相机/6190mAh大电池/支持5V/2A快充</p>
                    <span>999元 起</span>
                </div>
            </a>
        </section>
        <section class="chanpin">
            <a href="#">
                <div class="img"><img src="image/a.5.jpg"/><img class="xp" src="image/a.01.png"/></div>
                <div class="jieshao">
                    <h2>小米电视3S 43英寸</h2>
                    <p>LG、友达 全高清液晶屏/金属机身薄至10.9mm/内容丰富/支持壁挂</p>
                    <span>1799元 </span>
                </div>
            </a>
        </section>
        <section class="chanpin">
            <a href="#">
                <div class="img"><img src="image/a.6.jpg"/><img class="xp" src="image/a.01.png"/></div>
                <div class="jieshao">
                    <h2>小米电视3S 48英寸</h2>
                    <p>金属机身薄至9.9mm/原装三星液晶屏/四核支持1.45GHz CPU/独臂和dts音频双解码/支持壁挂</p>
                    <span>1999元 起</span>
                </div>
            </a>
        </section>
        <section class="chanpin">
            <a href="#">
                <div class="img"><img src="image/a.8.jpg"/><img class="xp" src="image/a.01.png"/></div>
                <div class="jieshao">
                    <h2>小米电视3S 65英寸 曲面</h2>
                    <p>原装进口三星超薄真4K曲面屏/金属机身薄至5.9mm/最美的小米电视</p>
                    <span>8999元 起</span>
                </div>
            </a>
        </section>
        <section class="chanpin">
            <a href="#">
                <div class="img"><img src="image/a.7.jpg"/></div>
                <div class="jieshao">
                    <h2>小米电视3</h2>
                    <p>全金属轻薄机身/次时代分体电视</p>
                    <span>3999元 起</span>
                </div>
            </a>
        </section>
        <section class="chanpin">
            <a href="#">
                <div class="img"><img src="image/a.9.jpg"/></div>
                <div class="jieshao">
                    <h2>九号平衡车</h2>
                    <p>22公里超长续航/轻、小、便携/重心驱动/15重安全保障</p>
                    <span>1999元</span>
                </div>
            </a>
        </section>
        <section class="chanpin" style="margin-bottom: 0.8rem">
            <a href="#">
                <div class="img"><img src="image/a.10.jpg"/><img class="xp" src="image/a.10.png"/></div>
                <div class="jieshao">
                    <h2>小米移动电源</h2>
                    <p>高品质电芯/铝合金金属外壳</p>
                    <span>49元 起</span>
                </div>
            </a>
        </section>
    </section>
    <footer>
        <ul>
            <li><a style="text-decoration: none; color: #9c9c9c" href="#"><div class="sc"></div><p class="ys">商城</p></a></li>
            <li><a style="text-decoration: none; color: #9c9c9c" href="fenlei.html"><div class="fl"></div><p>分类</p></a></li>
            <li><a style="text-decoration: none; color: #9c9c9c" href="gouwuche.html"><div class="gwc"></div><p>购物车</p></a></li>
            <li><a style="text-decoration: none; color: #9c9c9c" href="fuwudenglu.html"><div  class="fw"></div><p>服务</p></a></li>
        </ul>
    </footer>
</section>
</body>
<script>
    $(function(){
        function fullwidth(){
            if($('body').width() >= 720){
                $('html').css('font-size',100 + 'px');
                return;
            }
            var scale = $('body').width() / 720;
            $('html').css('font-size',scale * 100 + 'px');
        }
        fullwidth();
        $(window).resize(function(){
            fullwidth()
        });
    });
</script>
</html>
